<%@ page language="java" contentType="text/html; charset=utf8"
         pageEncoding="utf8" %>
<%
    String path = request.getContextPath();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="format-detection" content="telephone=no"/>
    <title>DCAMPUS走班排课</title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="shortcut icon" href="${pageContext.request.contextPath}/img/icon//favicon.ico" type="image/x-icon"/>

    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/js-lib/bootstrap/css/bootstrap.min.css">
    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="${pageContext.request.contextPath}/assets/js-lib/bootstrap/js/jquery.js"></script>
    <script src="${pageContext.request.contextPath}/assets/js-lib/jquery/jquery.cookie.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="${pageContext.request.contextPath}/assets/js-lib/bootstrap/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/common/wcmsIndex.css"/>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/css/common/common_ui.css"/>

    <!--layer-->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/assets/js-lib/layer/skin/default/layer.css"/>
    <script type="text/javascript" src="${pageContext.request.contextPath}/assets/js-lib/layer/layer.js"></script>

    <style>
        * {
            margin: 0px;
            padding: 0px;
        }

        div.tab-content > div {
            height: 270px;
        }

        .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
            background-color: rgb(216, 225, 233);
        }

        .nav-tabs > li.active {
            background-color: rgb(216, 225, 233);
        }

        .nav-tabs > li:hover {
            background-color: rgb(216, 225, 233);
        }

        .nav-tabs > li > a {
            background: white;
            font-size: 19px;
            margin: 0px;
        }

        span.changeImgReg, span.changeImgLogin {
            cursor: pointer;
        }

        form.form-horizontal p {
            margin-bottom: 0px;
        }

        .nav-tabs > li > a {
            background: rgb(182, 193, 205);
        }

        .nav-tabs > li {
            background: rgb(182, 193, 205);

        }

       body {
           overflow: hidden;
            background: url("${pageContext.request.contextPath}/assets/img/bg/2.jpg") #7CDAFE no-repeat;
/*          -moz-background-size: 100% 100%;
            background-size: 100% 100%;*/
        }


    </style>

    <script>


        $(function () {

            if($(".ssoError").val()!=""){
                layer.msg($(".ssoError").val(), {icon: 7,time:2000,shade: 0.01});
            }
            //记住账号
            var lastLoginName =$.cookie('loginName');
            if (lastLoginName){
                $("#loginName").val(lastLoginName);
                $("#password").trigger("focus");
            }else{
                $("#loginName").trigger("focus");
            }
            $(".changeImgLogin").click(imgLogin);
            $("#veryCodeLoginError").show();

            $('#loginForm').submit(function () {
                var c1 = checkNull('#loginName', '用户名不能为空！');
                var c2 = checkNull('#password', '密码不能为空！');
                var c3 = checkNull('#veryCodeLogin', '验证码不能为空！');

                if (c1 && c2 & c3) {

                    var userName = $("#loginName").val();
                    var userPwd = $("#password").val();
                    var veryCodeLogin = $("#veryCodeLogin").val();
                    $.ajax({
                        url: '<%=path%>/login.do',
                        dataType: 'json',
                        data: {userName: userName, userPwd: userPwd, veryCodeLogin: veryCodeLogin,rememberMe:$(".rememberMe").is(":checked")},
                        beforeSend: function () {
                            layer.msg('登录中，请稍候...', {
                                icon: 16,
                                shade: 0.01,
                                time: 0
                            });
                        },
                        success: function (data) {
                            //0--用户不存在,不能登陆
                            //1--用户验证成功,但没有完善信息
                            //2--用户验证成功,信息已完善
                            if (data.resultVal == -2) {
                                $("#veryCodeLoginError").text("验证码已过期");
                                layer.closeAll();
                            }
                            if (data.resultVal == -1) {
                                $("#veryCodeLoginError").text("验证码错误");
                                layer.closeAll();
                            }
                            else if (data.resultVal == 0) {
                                $("#passwordError").text("用户名或密码不正确！");
                                layer.closeAll();
                            }
                            else if (data.resultVal == 2) {//进入主界面
                                location.href = "<%=path%>/index.do";
                            }
                            if ((data.resultVal == -1 || data.resultVal == 0)) {
                                $("#codeDiv").show();
                                $("#veryCodeLoginError").show();
                                imgLogin();
                            }
                        }
                    });

                }
                return false;//不让表单提交
            });

            $('#loginName').click(function () {
                $("#loginNameError").text("");
            });
            $('#loginName').blur(function () {
                checkNull('#loginName', '用户名不能为空！');
            });

            $('#password').click(function () {
                $("#passwordError").text("");
            });
            $('#password').blur(function () {
                checkNull('#password', '密码不能为空！');
            });
            $('#veryCodeLogin').click(function () {
                $("#veryCodeLoginError").text("");
            });
            $('#veryCodeLogin').blur(function () {
                checkNull('#veryCodeLogin', '验证码不能为空！');
            });


            /* 登陆验证码 */
            function imgLogin() {
                $("#imgObjLogin").attr('src', '<%=path%>/randomCode.do?' + new Date().getTime());
            }

            /*
             * 判断输入框是否为空函数
             * @param {Object} val 输入框id值
             * @param {Object} tip 输入框为空的提示信息
             */
            function checkNull(val, tip) {
                var uName = $(val).val();
                if (uName.length == 0) {//如果输入框为空，使用Bootstrap提示框组件显示相应提示信息
                    $(val + "Error").text(tip);
                    return false;
                } else {//如果输入框不为空，设置Bootstrap提示框组件提示信息为''空字符串
                    $(val + "Error").text("");
                    return true;
                }
            }


            $("#btRegister").click(function () {
                window.location.href = "register.do";
            })

        });
    </script>
</head>
<body>
<input type="hidden" class="ssoError" value="${ssoError}" />
<%--<nav class="navbar navbar-default"
     style="background:#34383d;margin-bottom:0px;">
    <div class="container" style="color: white;">

        <div class="navbar-header" style="margin-top:15px;margin-right:20px;">
            <img src="${pageContext.request.contextPath}/assets/img/logo-big.png"/>
        </div>

        <div class="collapse navbar-collapse"
             id="bs-example-navbar-collapse-1">


        </div>
    </div>
     </nav>--%>
<nav class="navbar navbar-default" style="background:rgb(43,46,50);border-radius: 0;">
    <div class="container" style="color:white;">

        <!-- Brand and toggle get grouped for better mobile display -->
        <div class="navbar-header">
            <a class="navbar-brand" href="javascript:void(0);" style="color:white;font-size:23px;">DCAMPUS</a>
        </div>
    </div>
</nav>


<div class="container"
     style="height:90%;" id="containerDiv">
    <div class="row" style="margin-top: 2%;">
        <div class="col-md-3 col-md-offset-8"
             style="padding: 0px; background:white;">

            <!-- 登陆 -->
            <div class="panel-body" style="min-height:280px;height:auto;max-height:350px;">

                <div style="height:30px;text-align:center;border-bottom:1px solid white;font-size:18px;margin-bottom:10px;line-height:30px;">
                    登&nbsp;&nbsp;&nbsp;录
                </div>
                <form class="form-horizontal" role="form" id="loginForm" action="<%=path%>/login.do" method="post">

                    <p style="margin-bottom: 0px;">
                        <input type="text" id="loginName" name="userName"
                               class="form-control" placeholder="请输入用户名">
                    </p>
                    <div id="loginNameError"
                         style="height: 25px; font-size: 14px; line-height: 25px; color: rgb(160,0,0);">

                    </div>
                    <p style="margin-bottom: 0px;">

                        <input type="password" id="password" name="userPwd"
                               class="form-control" placeholder="请输入登录密码">
                    </p>
                    <div id="passwordError"
                         style="height: 25px; font-size: 14px; line-height: 25px; color: rgb(160,0,0)">

                    </div>
                    <div class="row" style="margin-bottom: 0px;" id="codeDiv">
                        <div class="col-xs-5" style="padding-right: 0px;">
                            <input type="text" name="veryCodeLogin" id="veryCodeLogin"
                                   class="form-control" placeholder="验证码">
                        </div>
                        <div class="col-xs-4">
                            <img id="imgObjLogin" src="<%=path%>/randomCode.do" height="34px"/>

                        </div>
                        <div class="col-xs-3"
                             style="line-height: 34px; text-align: right;">
                            <span class="changeImgLogin">换一张</span>
                        </div>

                    </div>

                    <div id="veryCodeLoginError"
                         style="height: 25px; font-size: 14px; line-height: 25px; color: rgb(160,0,0);display:none;">

                    </div>
                    <div class="row">
                        <div class="col-md-12">
                            <input type="checkbox"  class="rememberMe" checked />记住账号
                            &nbsp;&nbsp;
                            <a href="${pageContext.request.contextPath}/assets/doc/ZBPK-operation-instructions.docx">操作手册</a>
                        </div>
                    </div>

                    <div class="row" style="margin-top: 20px;">
                        <div class="col-md-12">
                            <input type="submit" class="btn btn-success" value="登&nbsp;录"
                                   style="border: 0px;width:40%;height: 35px;"
                                   id="btLogin"  />
                        </div>
                    </div>
                </form>
            </div>


        </div>
    </div>
</div>

<script type="text/javascript">
    /* 记住密码 */
    var lastLoginName = $.cookie('login');
    if (lastLoginName) {
        $("#loginName").val(lastLoginName);
        $("#password").trigger("focus");
    }

</script>

<footer id="divFooter" style="margin-top:0px;position:fixed;bottom:0px;width:100%;">
    <div class="divCopyright" style="padding:12px 0;">
        <div class="container">
            <div class="row">
                <div class="col-md-12">
                    <center>Copyright©2017 恒峰信息技术有限公司 All Rights Reserved</center>
                </div>
            </div>
        </div>
    </div>
</footer>

</body>
</html>